import React from 'react';
import { bindActionCreators } from 'redux';
import { connect } from 'react-redux';
import classNames from 'classnames';
import { Link, History } from 'react-router';

import {
  Grid,
  Row,
  Col
} from 'react-bootstrap';

import * as Shell from '../common/Shell';
import * as LoginActions from '../actions/LoginActions';
import * as UserActions from '../actions/UserActions';
import * as MessageActions from '../actions/MessageActions';
import Header from '../components/Header';
import Footer from '../components/Footer';
import MessageBadge from '../components/MessageBadge';
import Notify from '../common/Notification';

class Container extends React.Component {
  
  constructor() {
    super();
  }

  static contextTypes = {
    history: React.PropTypes.history
  }

  static propTypes = {
    isHeader : React.PropTypes.bool,
    isOffsetY : React.PropTypes.bool,
    isFooter : React.PropTypes.bool,
    isCopyRight : React.PropTypes.bool,
    isScroll : React.PropTypes.bool,
    isAuth : React.PropTypes.bool
  }

  static defaultProps = {
      isHeader : true,
      isOffsetY : true,
      isFooter : true,
      isScroll : true,
      isAuth : true,
      copyRight : null
  }

  refreshUserToken(){
    this.props.userAction.fetchUser();
  }

  componentDidMount(){
    let { isAuth } = this.props;
    if (isAuth === true) {
      this.props.userAction.fetchUser();
      this.props.messageAction.fetchMessageCount();

      //刷新用户身份信息，间隔2分钟
      this.refreshTimer = setInterval(function(){
        this.refreshUserToken();
      }.bind(this), 120000);
    }
  }

  componentWillUnmount(){
    clearInterval(this.refreshTimer);
  }

  componentDidUpdate(){
    let { isAuth } = this.props;
    if (isAuth === true) {
      let { user_status = 0, message = "" } = this.props.user;
      //用户身份信息已过期
      if(user_status === -1){

        Notify.makeNotify("身份认证信息已过期",3);

        let timer = setTimeout(function(){
          clearTimeout(timer);
          this.context.history.pushState(null, "/Account");
        }.bind(this), 3500);
      }
    }
  }

  render() {
    let { isHeader, isHeaderMessage, isFooter, isOffsetY, copyRight } = this.props;
    return (
        <div>
            { 
              isHeader ? 
              <Header {...this.props}>
                {
                   isHeaderMessage ? <MessageBadge count={this.props.messagecount.count}/> : null
                }
              </Header>
              : 
              null 
            }
            <div id="main" ref="main" {...this.props}>
              <div className="container-fluid">
                { isOffsetY ? <div className="blank50"></div> : null }

                { this.props.children }

                { isFooter ? <div className="blank50"/>  : null }       
              </div>
            </div>

            { copyRight }

            { isFooter ? <Footer {...this.props}/>  : null }

        </div>
    );
  }
}

export default connect(state => ({
    user: state.user,
    messagecount : state.messagecount,
    login : state.login
}), dispatch => ({
    userAction: bindActionCreators(UserActions, dispatch),
    loginAction: bindActionCreators(LoginActions, dispatch),
    messageAction: bindActionCreators(MessageActions, dispatch)
}))(Container);